<template>
  <!-- 交底管理-->
  <div class="schemeApproval">
    <title-name title="交底管理" style="margin-top: 50px"></title-name>
    <a-spin :spinning="loading">
    <div class="table-div">
      <h3 class="updateSummary-h3">当月施组方案交底情况（普通方案）</h3>
      <a-table  :columns="columns" bordered :pagination="false" :data-source="meetList"> </a-table>
    </div>
    <div class="table-div">
      <h3 class="updateSummary-h3">当月施组方案交底情况（专业分包方案）</h3>
      <a-table  :columns="columnsTwo" bordered :pagination="false" :data-source="proMeetList"> </a-table>
    </div>
    </a-spin>
  </div>
</template>
  <script>
import { summaryMixin } from './mergeCell'
import {queryMonthTechnicalConfessMeetList } from '@/api/technical/summary' // api
export default {
  mixins: [summaryMixin], //混入文件
  name: 'a' + Date.now(),
  props: {
    monthTechnicalId: {
      type: String,
      default() {
        return ''
      }
    },
    orgTreeObj:{
      type:Object,
      default(){
        return {}
      }
    }
  },
  data() {
    this.columns = [
      {
        title: '所属分公司',
        align: 'center',
        dataIndex: 'branchComId',
        width:'16%',
        customRender: (text, row, index) => {
          // this.$nextTick(() => {
          let rowSpan = 1
          if (index != 0 && text === this.meetList[index - 1].branchComId) {
            rowSpan = 0
            // 若不是，则往下合并与改行考核内容一致行的总行数
          } else {
            rowSpan = [...this.meetList].filter((i) => i.branchComId == text).length
          }
          return {
            children: row.branchCompany,
            attrs: {
              rowSpan: rowSpan,
            },
          }
          // })
        },
      },
      { title: '所属项目名称', align: 'center', dataIndex: 'projectName', width:'18%',
         customRender: (text, row, index) => {
            let rowSpan = 1
            if (
                index != 0 &&
                text === this.meetList[index - 1].projectName &&
                row.branchCompany ===this.meetList[index - 1].branchCompany
            ) {
                rowSpan = 0
                // 若不是，则往下合并与改行考核内容一致行的总行数
            } else {
                rowSpan = [...this.meetList].filter((i) => i.projectName == text && row.branchCompany === i.branchCompany).length
            }
            return {
                children: text,
                attrs: {
                rowSpan: rowSpan,
                },
            }
            // })
            },
    },
      { title: '施工方案名称', dataIndex: 'programName', align: 'center', width:'13%',},
      { title: '方案类别', dataIndex: 'planTypeName', align: 'center',width:'11%'},
      { title: '方案审批通过时间', dataIndex: 'confessAuditDate', align: 'center',width:'9%',},
      { title: '交底人', dataIndex: 'confessUserName', align: 'center',width:'11%',},
      { title: '交底时间', dataIndex: 'confessDate', align: 'center',width:'11%',},
      { title: '参与人数量', dataIndex: 'joinNum', align: 'center',width:'11%',},
    ],
    this.columnsTwo = [
      {
        title: '所属分公司',
        align: 'center',
        dataIndex: 'branchComId',
        width:'16%',
        customRender: (text, row, index) => {
          // this.$nextTick(() => {
          let rowSpan = 1
          if (index != 0 && text === this.proMeetList[index - 1].branchComId) {
            rowSpan = 0
            // 若不是，则往下合并与改行考核内容一致行的总行数
          } else {
            rowSpan = [...this.proMeetList].filter((i) => i.branchComId == text).length
          }
          return {
            children: row.branchCompany,
            attrs: {
              rowSpan: rowSpan,
            },
          }
          // })
        },
      },
      { title: '所属项目名称', align: 'center', dataIndex: 'projectName', width:'18%',
         customRender: (text, row, index) => {
            let rowSpan = 1
            if (
                index != 0 &&
                text === this.proMeetList[index - 1].projectName &&
                row.branchCompany ===this.proMeetList[index - 1].branchCompany
            ) {
                rowSpan = 0
                // 若不是，则往下合并与改行考核内容一致行的总行数
            } else {
                rowSpan = [...this.proMeetList].filter((i) => i.projectName == text && row.branchCompany === i.branchCompany).length
            }
            return {
                children: text,
                attrs: {
                rowSpan: rowSpan,
                },
            }
            // })
            },
    },
      { title: '施组方案名称', dataIndex: 'programName', align: 'center', width:'13%',},
      { title: '方案类别', dataIndex: 'planTypeName', align: 'center',width:'11%'},
      { title: '方案审批通过时间', dataIndex: 'confessAuditDate', align: 'center',width:'9%',},
      { title: '交底人', dataIndex: 'confessUserName', align: 'center',width:'11%',},
      { title: '交底时间', dataIndex: 'confessDate', align: 'center',width:'11%',},
      { title: '参与人数量', dataIndex: 'joinNum', align: 'center',width:'11%',},
    ]
    return {
      meetList:[],
      proMeetList:[],
      loading:false
    }
  },
  watch:{
    monthTechnicalId: {
      handler(val) {
        this.queryMonthTechnicalConfessMeetListFn(val,this.orgTreeObj);
      },
      immediate: true
    },
    orgTreeObj:{
      handler(newVal) {
        this.queryMonthTechnicalConfessMeetListFn(this.monthTechnicalId,newVal);
			},
			deep:true, // 深度监听
			//immediate:true, // 初始化监听
    }
  },
  methods: {
    queryMonthTechnicalConfessMeetListFn(id,searchQuery){
      let obj = {
        monthTechnicalId:id,
        searchQuery,
      }
      this.loading = true;
      queryMonthTechnicalConfessMeetList(obj).then((res)=>{
        this.loading = false;
        if(res.code == '0'){
          let data = res.data;
          this.meetList = data.meetList;
          this.proMeetList = data.proMeetList;
        }
      })
    }
  },
  mounted() {
  }
}
</script>
  <style lang="less" scoped>
  @deep: ~'>>>';
.schemeApproval{
 .updateSummary-h3{
        line-height: 45px;
        width: 100%;
        text-align: center;
        background: rgb(244, 244, 244);
        border: 1px solid gainsboro;
        border-bottom: none;
        font-size: 14px;
        margin: 0;
    }
  @{deep}.titleName{
    margin-top:10px!important;
  }
  .table-div{
    margin-bottom: 40px;
  }
}
</style>
  